
<template>
  <a-tabs 
    :data-index="index" 
    v-model="value" 
    @change="(value)=> handleChange(value, 'value', element.key)"
    class="c-tabs"
    :class="element.isDrop ? 'drop' : ''"><slot /></a-tabs>

  
</template>

<script>
import { mapState } from "vuex"
import formMixin from "../formMixin.js"
import { getProps } from "./attr"
export default {
  mixins: [formMixin],
  props: getProps(),
  computed:{
    ...mapState('lowCode', {
      selectedComponent: state => state.selectedComponent
    })
  }
}
</script>

<style lang="less" scoped>
  
  .c-tabs {
    background: #fff;
    height: 100%;
    overflow: hidden;
    /deep/ .ant-tabs-top-bar {
      margin-bottom: 0;
    }
    /deep/ .ant-tabs-content {
      height: calc(~"100% - 46px");
    }
    
  }
   .drop > ::v-deep div.ant-tabs-content > .ant-tabs-tabpane-active {
    border: 1px dashed @theme-color;
    
  }
</style>
